<template>
  <div>
    <div class="grid grid-cols-2 md:gap-4 !md:m-4">
      <FunctionClicksSummaryCard v-if="checkPowerByName('getTotalClickNums')" />
      <FunctionClicksAverageCard v-if="checkPowerByName('getAverageClickNums')" />
      <AveFunctionClicksCompCard v-if="checkPowerByName('getAverageNumsComparison')" />
      <DailyFunctionClicksCompCard v-if="checkPowerByName('getDailyNumsComparison')" />
    </div>
  </div>
</template>

<script lang="ts" setup>
import FunctionClicksSummaryCard from './cards/FunctionClicksSummaryCard.vue';
import FunctionClicksAverageCard from './cards/FunctionClicksAverageCard.vue';
import AveFunctionClicksCompCard from './cards/AveFunctionClicksCompCard.vue';
import DailyFunctionClicksCompCard from './cards/DailyFunctionClicksCompCard.vue';
import { checkPowerByName } from '../../../../utils/permission';
</script>
